//colors色彩
$primary-color: #224A90; //主色调
$gray-color:red !important; //灰色字体
$bg-color:rgba(244, 246, 249, 0.8); //主背景色
$tabbg-color:rgba(240, 242, 245, 1); //tab背景色
$titlebg-color:rgba(34, 74, 144, 0.1); //标题背景色
$border-color:rgba(232, 232, 232, 1); //边框颜色
$tablebg-color:rgba(250, 250, 250, 1); //表格项背景色
$tablehover-color:rgba(245, 247, 250, 1); //表格hover
$active-color:#DF5A2C;
$bar-color:rgba(34, 74, 144, 0.1); //背景条颜色
$text-color:rgba(0, 0, 0, 0.85); //正文颜色
$link-color:#326BE6; //链接
$red-color:#E02020;
$loginBut-color:#224A90; //登录按钮颜色
$loginButHover-color:rgba(34, 74, 144, 0.85); //登录hover按钮颜色
$but-color:#DF5A2C; //按钮颜色
$butHover-color:rgba(223, 90, 44, 0.85); //按钮hover颜色
// 字体大小
$min-size:12px;
// 文字颜色

//背景颜色

//边框颜色

//主题颜色

//菜单栏颜色
html,body{
    font-size: 14px;
    color: $gray-color;
}
$size-map: (-2: -2px,4: 4px, 5: 5px, 10: 10px, 15: 15px, 20: 20px, 24: 24px, 25: 25px, 30: 30px, 40: 40px, 140: 140px);
@each $name in map-keys($size-map) {
    $value: map-get($size-map, $name);
    .mt-#{$name} {
        margin-top: $value;
    }
    .mr-#{$name} {
        margin-right: $value;
    }
    .mb-#{$name} {
        margin-bottom: $value;
    }
    .ml-#{$name} {
        margin-left: $value;
    }
    .margin-#{$name} {
        margin: $value;
    }
    .pt-#{$name} {
        padding-top: $value !important;
    }
    .pr-#{$name} {
        padding-right: $value;
    }
    .pb-#{$name} {
        padding-bottom: $value;
    }
    .pl-#{$name} {
        padding-left: $value;
    }
    .pd-#{$name} {
        padding: $value;
    }
}


// 标题条样式
// 带原点
.title-bar {
    position: relative;
  height: 54px;
  line-height: 54px;
  padding-left: 35px;
  text-align: left;
  font-size: 16px;
  background:linear-gradient(180deg,rgba(154,190,242,.2) 0%,rgba(96,137,226,.2) 100%);
  color:$primary-color;
 &::before{
     content: "";
     position: absolute;
     top: 25px;
     left: 24px;
     display: inline-block;
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background:linear-gradient(228deg,rgba(51,141,205,1) 0%,rgba(39,83,163,1) 100%);
 }
}
//不带原点
.title-bar-nocircle {
    position: relative;
  height: 54px;
  text-align: center;
  line-height: 54px;
  padding-left: 35px;
  font-size: 16px;
  background:linear-gradient(180deg,rgba(71,129,195,1) 0%,rgba(34,74,144,1) 100%);
  color:#fff;
}
//不带背景色
.title-bar-nobg {
    position: relative;
  height: 54px;
  line-height: 54px;
  padding-left: 35px;
  text-align: left;
  font-size: 16px;
  color:$primary-color;
 &::before{
     content: "";
     position: absolute;
     top: 25px;
     left: 24px;
     display: inline-block;
     width: 6px;
     height: 6px;
     border-radius: 50%;
     background-color:$primary-color ;
 }
}
// 链接按钮
.linkBtn{
    color: $link-color;
    cursor: pointer;
}
.flex-row{display: flex;flex-direction: row;}
.flex-col{display: flex;flex-direction: column;}
/*************垂直上对齐********/
.flex-y-start{display: flex;  align-items: flex-start;}
/*************垂直居中********/
.flex-y-center{display: flex; align-items:center;}
/*************垂直下对齐********/
.flex-y-end{display: flex; align-items: flex-end;}
/*************垂直两端对齐********/
.flex-y-between{display: flex; align-items: space-between;}
/*************水平 间隔相等 均匀显示********/
.flex-y-around{display: flex; align-items:space-around}
/*************水平左对齐********/
.flex-x-start{display: flex;justify-content: flex-start;}
/*************水平居中********/
.flex-x-center{display: flex;justify-content: center;}
/*************水平两端对齐********/
.flex-x-between{display: flex;justify-content: space-between;}
/*************右侧对齐********/
.flex-x-end{display: flex;justify-content: flex-end;}
/*************水平 间隔相等 均匀显示********/
.flex-x-around{display: flex;justify-content:space-around}
.flex-1{display: flex;flex-grow:1}
.flex-center{display: flex; align-items:center;justify-content: center;}

// 平台管理公共样式
.manage {
  padding: 24px 24px 0;
  .screen {
    padding-bottom: 20px;
    ul {
      display: flex;
      li {
        list-style-type: none;
        padding-right: 12px;
        .ivu-input-group {
          top: 0px;
        }
      }
    }
    .btn {
      width: 88px;
      height: 32px;
    }
  }
}
//按钮
.btn-primary{
    color: #fff;
    background-color: #409eff;
    border-color: #409eff;
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    -webkit-appearance: none;
    text-align: center;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    transition: .1s;
    font-weight: 500;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    padding: 12px 20px;
    font-size: 14px;
    border-radius: 4px;
}
